<template>
	<div>
		<el-button type="primary" plain  @click="planSelect(item.id)"
		>数据清单
		</el-button
		>
		<el-dialog
				width="80%"
				
				title="数据清单"
				:visible.sync="outerVisible">

			<el-card style="margin-bottom: 14px">
				<el-form
						:inline="true"
						:model="searchData"
						class="demo-form-inline messageInput"
						label-position="left" style="margin-top: 20px">

					<el-form-item label="图斑ID">
						<el-input
								v-model="searchData.landCode"
								maxlength="12"
								show-word-limit
								placeholder="请输入"></el-input>
					</el-form-item>
					<el-form-item label="采集状态">
						<!-- 采集状态 1：未采集 2： 已采集  -->
						<el-select v-model="searchData.collection">
							<el-option v-for="(item, index) in collectionList" :key="index" :label="item.label" :value="item.value">
							</el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="审核状态">
						<!-- 审核状态: 0:初始 1:待审核 2:审核成功 3:审核失败 -->
						<el-select v-model="searchData.review">
							<el-option v-for="(item, index) in reviewList" :key="index" :label="item.label" :value="item.value">
							</el-option>
						</el-select>
					</el-form-item>


					<el-button type="primary" @click="searchLand()">查询</el-button>
					<el-button @click="resetValues()">重置</el-button>
				</el-form>
			</el-card>
			<el-card>
				<div slot="header" class="clearfix">
					<span>图斑数据</span>
					<el-button
							size="medium"
							type="primary"
							style="float: right"
							@click="auditMore()"
					>批量审核
					</el-button
					>
				</div>
				<el-table
						:data="tableData"
						border
						style="width: 100%; margin: 15px 0"
						@selection-change="handleSelectionChange"
				>
					<el-table-column
							prop="id"
							type="selection"
							width="55"
					></el-table-column>

					<el-table-column fixed prop="landCode" label="图斑ID" width="100">
						<template slot-scope="tableData">
							{{ tableData.row.landId }}
						</template>
					</el-table-column>

					<el-table-column
							align="center"
							prop="planName"
							width="150"
							label="所在任务"
					>
					</el-table-column>

					<el-table-column prop="landName" label="地塘块命名" width="150">
						<template slot-scope="tableData">
							{{ tableData.row.landName }}
						</template>
					</el-table-column>
					<el-table-column prop="landTownName" label="镇街" width="100">
						<template slot-scope="tableData">
							{{ tableData.row.landTownName }}
						</template>
					</el-table-column>
					<el-table-column prop="landVillageName" label="村居" width="100">
						<template slot-scope="tableData">
							{{ tableData.row.landVillageName }}
						</template>
					</el-table-column>
					<el-table-column prop="landProductArea" label="面积(亩)" width="100">
					</el-table-column>

					<!-- <el-table-column prop="belongsBody" label="所属主体"> </el-table-column> -->
					<el-table-column
							align="center"
							width="80"
							prop="gather"
							label="采集状态"
					>
						<template slot-scope="scope">{{
								scope.row.collectStatus == "2" ? "已经采集" : "未采集"
							}}
						</template>
					</el-table-column>
					<el-table-column
							align="center"
							width="100"
							prop="auditStatus"
							label="审核状态"
					>
						<template slot-scope="scope">
							{{ auditStatusCn(scope.row.auditStatus) }}
						</template>
					</el-table-column>
					<el-table-column
							align="center"
							prop="auditPerson"
							label="审核人"
							width="150"
					>
					</el-table-column>
					<el-table-column
							align="center"
							prop="auditDate"
							label="审核时间"
							width="250"
					>
					</el-table-column>

					<el-table-column label="操作" fixed="right" width="100">
						<template slot-scope="scope">
							<el-button type="text" @click="checkAudit(scope.row)"
							>审核
							</el-button
							>
						</template>
					</el-table-column>
				</el-table>

				<div class="bottom" style="margin: 15px 0; float: right">
					<el-pagination
							background
							@size-change="handleSizeChange"
							@current-change="currentchange"
							:current-page="paging.pageNum"
							:page-sizes="[5, 10, 20, 30, 40]"
							:page-size="paging.pageSize"
							layout="total, sizes, prev, pager, next, jumper"
							:total="paging.total"
					>
					</el-pagination>
				</div>
			</el-card>

			<el-dialog
					title="图斑地块审核"
					:visible.sync="dialogStatus"
					:close-on-click-modal="false"
					width="40%"
					:destroy-on-close="true"
					:append-to-body="true"
			>
				<el-form
						:model="modelData"
						status-icon
						ref="modelData"
						:inline="false"
						size="normal"
						label-width="90px"
						label-position="right"
				>
					<el-row>
						<el-col :span="24">
							<el-card>
								<el-form-item label="图斑ID" prop="landId">
									<el-input
											type="text"
											:disabled="true"
											v-model="modelData.landId"
									>
									</el-input>
								</el-form-item>

								<el-form-item label="地块名" prop="landName">
									<el-input
											type="text"
											:disabled="true"
											v-model="modelData.landName"
									>
									</el-input>
								</el-form-item>

								<el-form-item label="面积(亩)" prop="landProductArea">
									<el-input
											type="text"
											:disabled="true"
											v-model="modelData.landProductArea"
									>
									</el-input>
								</el-form-item>
								<el-form-item label="镇街" prop="landTownName">
									<el-input
											type="text"
											:disabled="true"
											v-model="modelData.landTownName"
									>
									</el-input>
								</el-form-item>
								<el-form-item label="村居" prop="landVillageName">
									<el-input
											type="text"
											:disabled="true"
											v-model="modelData.landVillageName"
									>
									</el-input>
								</el-form-item>
								<el-form-item label="审核状态" prop="name">
									<!-- <el-input v-model="modelData.auditStatus"> </el-input> -->
									<template>
										<el-radio v-model="modelData.auditStatus" :label="2"
										>通过
										</el-radio
										>
										<el-radio v-model="modelData.auditStatus" :label="3"
										>不通过
										</el-radio
										>
									</template>
								</el-form-item>
								<el-form-item label="审核描述" prop="name">
									<el-input type="textarea" v-model="modelData.auditMemo">
									</el-input>
								</el-form-item>
							</el-card>
						</el-col>
					</el-row>
				</el-form>
				<span slot="footer" class="dialog-footer">
          <el-button type="primary" size="mini" @click="onSubmit()"
		  >确 定</el-button
		  >
        </span>
			</el-dialog>
		</el-dialog>
	</div>
</template>

<script>
export default {
	props: {
		item: Object,
	},
	data() {
		return {
			outerVisible: false,
			form: {
				week: "",
			},
			multipleSelection: [],
			tableData: [],
			search: {
				planName: "",
				value: "",
			},
			searchData: {
				pageNumber: 1,
				pageSize: 10,
				landTownCode: "",
				review: ''
			},
			// 采集状态 1：未采集 2： 已采集
			collectionList: [
				{
					label: '未采集',
					value: 1
				},
				{
					label: '已采集',
					value: 2
				},
			],
			// 审核状态: 0:初始 1:待审核 2:审核成功 3:审核失败
			reviewList: [
				{
					label: '初始状态',
					value: 0
				},
				{
					label: '待审核',
					value: 1
				},
				{
					label: '审核成功',
					value: 2
				},
				{
					label: '审核失败',
					value: 3
				}
			],
			params: {
				pageNumber: 1,
				pageSize: 10,
			},
			paging: {},
			List: [],
			options: [],
			townIndex: 0,
			dialogStatus: false,
			modelData: {},
			plans: [],
		};
	},
	created() {
		this.selectData();
		// this.planData();
	},
	methods: {
		searchLand () {
			let params = {
				"collectTaskLand.collectStatus" : this.searchData.collection,
				"landInfo.landCode" : this.searchData.landCode,
				"landInfo.landTownCode" : this.searchData.landTownCode,
				"pageNumber": this.paging.pageNum,
				"pageSize": this.paging.pageSize,
				"collectTaskLand.auditStatus" : this.searchData.review,
				"collectTaskLand.planId": this.item.id
			}

			this.$axios.get("rbac/data/CollectTaskLand/list", {
				params: params
			}).then((res) => {
				console.log(res)
				this.tableData = res.data.list
				this.paging = res.data
			})

		},
		resetValues () {
			this.searchData.landCode = ''
			this.searchData.review = ''
			this.searchData.collection = ''
		},
		planSelect(val) {
			this.$axios
					.get("rbac/data/CollectTaskLand/list", {
						params: {
							"collectTaskLand.planId": val,
						},
					})
					.then((res) => {
						console.log(res)
						this.tableData = res.data.list;
						this.paging = res.data;
						this.outerVisible = true;
					});
		},
		auditStatusCn(index) {
			var Status = {
				0: "初始状态",
				1: "待审核",
				2: "审核通过",
				3: "审核失败",
			};

			return Status[index];
		},
		planData() {
			this.$axios
					.get("task/task/queryPlanAccordingToTheTask", {
						params: {
							pageNumber: 1,
							pageSize: 100,
						},
					})
					.then((res) => {
						this.plans = res.data.list;
					});
		},
		selectData() {
			var json = JSON.parse(
					window.localStorage.getItem("getTreeData/setAsyncVillageData")
			);
			this.options = json[0].children[0].children;
		},
		statusChange(item) {
			console.log(item);
		},
		onSearch() {
		},
		handleSizeChange(pageSize) {
			this.params["collectTaskLand.planId"] = this.item.id;
			this.params.pageSize = pageSize;
			this.paging.pageSize = pageSize
			console.log(this.params, 1);
			this.list();
		},
		currentchange(pageNumber) {
			this.params["collectTaskLand.planId"] = this.item.id;
			this.params.pageNumber = pageNumber;
			this.paging.pageNum = pageNumber;
			console.log(this.params, 2);
			this.list();
		},

		list() {
			let params = {
				"collectTaskLand.collectStatus" : this.searchData.collection,
				"landInfo.landCode" : this.searchData.landCode,
				"landInfo.landTownCode" : this.searchData.landTownCode,
				"pageNumber": this.paging.pageNum,
				"pageSize": this.paging.pageSize,
				"collectTaskLand.auditStatus" : this.searchData.review,
				"collectTaskLand.planId": this.item.id
			}
			this.$axios
					.get("rbac/data/CollectTaskLand/list", {
						params: params,
					})
					.then((res) => {
						this.tableData = res.data.list;
						this.paging = res.data;
					});
		},
		searchInfo() {
			this.$axios
					.get("rbac/data/LandInfo/getList", {
						params: {
							"landInfo.landCode": this.searchData.landCode,
							"landInfo.landName": this.searchData.landName,
							"landInfo.landTownCode": this.searchData.landTownCode,
							"landInfo.landVillageCode": this.searchData.landVillageCode,
							"landSubject.lsSubjectCode": this.searchData.lsSubjectCode,
							"landInfo.landProduct": this.searchData.landProduct,
							subjectName: this.searchData.subjectName,
							"landInfo.auditStatus": -1,
						},
					})
					.then((res) => {
						this.tableData = res.data.list;
						this.paging = res.data;
					});
		},
		onSubmit() {
			this.dialogStatus = false;
			this.$confirm("是否确认操作?", "提示", {
				confirmButtonText: "确定",
				cancelButtonText: "取消",
				type: "warning",
			})
					.then(() => {
						//发送审核请求
						this.$axios
								.post("rbac/LandSubject/auditLand", {
									params: {
										landIds: this.modelData.id,
										auditStatus: this.modelData.auditStatus,
										auditMemo: this.modelData.auditMemo,
									},
								})
								.then((result) => {
									//   this.list();
									this.$message.success("操作完成");
								});
					})
					.catch(() => {
					});
		},

		checkAudit(row) {
			console.log(row);
			this.modelData = row;
			this.dialogStatus = true;
		},

		auditMore() {
			var val = this.selectedData;
			if (val) {
				this.$confirm("是否批量通过审核?", "提示", {
					confirmButtonText: "确定",
					cancelButtonText: "取消",
					type: "warning",
				})
						.then(() => {
							var arr = [];
							val.forEach(function (item, index) {
								console.log(item.id);
								arr.push(item.id);
							});

							this.$axios
									.post("rbac/LandSubject/auditLand", {
										params: {
											landIds: arr.join(","),
											auditStatus: 2,
										},
									})
									.then((result) => {
										console.log(result)
										this.list();
										this.$message.success("审核完成");
									});
						})
						.catch(() => {
						});
			} else {
				this.$alert("请至少选中一条记录", "审核选择", {
					confirmButtonText: "确定",
					// callback: (action) => {
					//   this.$message({
					//     type: "message",
					//     message: `action: ${action}`,
					//   });
					// },
				});


			}
		},
		openn() {
			this.$alert("这是一段内容", "标题名称", {
				confirmButtonText: "确定",
				callback: (action) => {
					this.$message({
						type: "info",
						message: `action: ${action}`,
					});
				},
			});
		},
		handleSelectionChange(val) {
			this.selectedData = val;
		},
	},
};
</script>

<style lang="scss">
.checkdata {
	background: #fff;
	padding: 15px;

	.ReviewButton {
		margin: 10px 0;
	}

	.cell {
		display: flex;
		justify-content: space-around;

		.el-button {
			margin: 0 5px;
		}
	}

	.subject {
		display: flex;
	}
}

.sh {
	p {
		line-height: 35px;
	}
}
</style>
